<!DOCTYPE html>
<html>
  <head>
    <title><%= title %></title>
    <link rel='stylesheet' href='/css/style.css' />
    <script src="/js/jquery.js"></script>
    <script src="https://unpkg.com/qiniu-js@2.5.1/dist/qiniu.min.js"></script>
  </head>
  <body>
    <header>
      <nav>
        <ul>
          <li>
            <a href="/article/write">写文章</a>
          </li>
          <li>
            <a href="/article/manage">文章管理</a>
          </li>
          <li>
            <a href="/chatRoom">进入聊天</a>
          </li>
        </ul>
        <div onclick="logout()">退出</div>
      </nav>
    </header>
    <h1><%= title %></h1>
    <p>Welcome to <%= title %></p>
    <div>
      <% if (articles.length > 0) { %>
          <% articles.forEach(function(article){ %>
            <div>
              <div><%= article.title %></div>
              <div><%- article.content %></div>

            </div>
          <% }) %>
      <% } %>
    </div>

    <!-- <form method="post" action="http://upload.qiniup.com/"
    enctype="multipart/form-data">
      <input name="key" type="hidden" value="<resource_key>">
      <input name="x:<custom_name>" type="hidden" value="<custom_value>">
      <input name="token" type="hidden" value="<upload_token>">
      <input name="crc32" type="hidden" />
      <input name="accept" type="hidden" />
      <input name="file" type="file" />
      <input type="submit" value="上传文件" />
    </form> -->

    <input type="file" id="file" name="file" onchange="updateImg(event)"/>
    <button onclick="updateImg()">update img</button>


    
    <script>
      function updateImg(e) {
        console.log('updateImg---', e);
        var file = e.target.files[0];
        console.log('updateImg--file-', file);
        console.log('path---', file.path);
        var sourceUrl = URL.createObjectURL(file);
        console.log('sourceUrl---', sourceUrl);
        console.log('this.files-----', e.target.files);

        // var accessKey = 'k6KUdarbJ6QDrv6_o6hHIVb2IA-OXhDMrgAi6jBn';
        // var secretKey = 'gbN4U0d5-rdec7mGK-y0IkZZLgYajh6cejvuO-tP';
        // console.log('secretKey::::--', secretKey);
        // console.log('window--', window);
        // var mac = new qiniu.auth.digest.Mac(accessKey, secretKey);
        // console.log('mac::::--', mac);
        // var options = {
        //     scope: 'zjl606-web', // bucket
        //     expires: 7200
        // };
        // var putPolicy = new qiniu.rs.PutPolicy(options);
        // var uploadToken=putPolicy.uploadToken(mac);
        // console.log('uploadToken::::--', uploadToken);

        // var config = new qiniu.conf.Config();
        // // 空间对应的机房
        // config.zone = qiniu.zone.Zone_z0;
        // // var localFile = "/Users/qsym/Desktop/gui.jpg";
        // var formUploader = new qiniu.form_up.FormUploader(config);
        // var putExtra = new qiniu.form_up.PutExtra();
        var key=file.name;

        $.ajax({
          url: "/api/qiniu/getToken",
          method: "GET",
          data: {},
          success: function(res) {
            console.log('res--token', res);
            var token = res.token;
            var config = {
              useCdnDomain: true,
              region: qiniu.region.z0
            };
            var putExtra = {
              fname: file.name,   //fname: string，文件原文件名
              params: {},  // params: object，用来放置自定义变量
              mimeType: [] || null  //mimeType: null || array，用来限制上传文件类型，为 null 时表示不对文件类型限制；限制类型放到数组里： ["image/png", "image/jpeg", "image/gif"]
            };
            var observable = qiniu.upload(file, key, token, putExtra, config)
            var subscription = observable.subscribe({
              next(res){
                // ...
                console.log('next----', res);
              },
              error(err){
                // ...
                console.log('err----', err);
              }, 
              complete(res){
                // ...
                console.log('complete----', res);
              }
            }) // 上传开始
            // or
            // var subscription = observable.subscribe(next, error, complete) // 这样传参形式也可以
            console.log('subscription---', subscription);
            // subscription.unsubscribe() // 上传取消
          },
          error: function(err) {
            console.error('err::', err);
          }
        });
        
        
      }
      function logout() {
            $.ajax({
                url: "/api/logout",
                method: 'POST',
                data: {},
                success: function( result ) {
                    window.location.href = "/login";
                }
            });
        }
    </script>
  </body>
</html>
